// // // import React, {
// // //   AppRegistry,
// // //   Component,
// // //   Text,
// // //   View,
// // // } from 'react-native';
// // // import BarcodeScanner from 'react-native-barcodescanner';

// // // class BarcodeScannerExampleApp extends Component {
// // //   constructor(props) {
// // //     super(props);

// // //     this.state = {
// // //       torchMode: 'off',
// // //       cameraType: 'back',
// // //     };
// // //   }

// // //   barcodeReceived(e) {
// // //     console.log('Barcode: ' + e.data);
// // //     console.log('Type: ' + e.type);
// // //     alert(e.data);
// // //   }

// // //   render() {
// // //     return (
// // //       // <View>
// // //         <BarcodeScanner
// // //           onBarCodeRead={this.barcodeReceived}
// // //           style={{ flex: 1 }}
// // //           torchMode={this.state.torchMode}
// // //           cameraType={this.state.cameraType}
// // //         />
// // //       //       <Text>
// // //       //       Welcome to React Native!
// // //       //     </Text>

// // //       // </View>
// // //     );
// // //   }
// // // }

// // // AppRegistry.registerComponent('flipped', () => BarcodeScannerExampleApp);

// // /**
// //  * Sample React Native App
// //  * https://github.com/facebook/react-native
// //  * @flow
// //  */

// // import React, { Component } from 'react';
// // import {
// //   NativeModules,
// //   AppRegistry,
// //   StyleSheet,
// //   Text,
// //   View,
// //   TouchableHighlight
// // } from 'react-native';
// // const Toast = NativeModules.ToastCustomAndroid;

// // class flipped extends Component {
// //   render() {
// //     return (
// //       <View style={styles.container}>
// //         <Text style={styles.welcome}>
// //           Welcome to React Native!
// //         </Text>
// //         <Text style={styles.instructions}>
// //           To get started, edit index.ios.js
// //         </Text>
// //         <Text style={styles.instructions}  onPress={()=>alert(11)}>
// //           Press Cmd+R to reload,{'\n'}
// //           Cmd+D or shake for dev menu
// //         </Text>
// //       </View>
// //     );
// //   }
// // }

// // const styles = StyleSheet.create({
// //   container: {
// //     flex: 1,
// //     justifyContent: 'center',
// //     alignItems: 'center',
// //     backgroundColor: '#F5FCFF',
// //   },
// //   welcome: {
// //     fontSize: 20,
// //     textAlign: 'center',
// //     margin: 10,
// //   },
// //   instructions: {
// //     textAlign: 'center',
// //     color: '#333333',
// //     marginBottom: 5,
// //   },
// // });

// // AppRegistry.registerComponent('flipped', () => flipped);
// /**
//  * Sample React Native App
//  * https://github.com/facebook/react-native
//  */

// import React, {
//   NativeModules,
//   AppRegistry,
//   Component,
//   StyleSheet,
//   Text,
//   View,
//   TouchableHighlight,
//   ToastAndroid,
// } from 'react-native';
// class CustomButton extends Component {
//   render() {
//     return (
//       <TouchableHighlight
//         style={styles.button}
//            underlayColor="#a5a5a5"
//         onPress={this.props.onPress}>
//         <Text style={styles.buttonText}>{this.props.text}</Text>
//       </TouchableHighlight>
//     );
//   }
// }

// /**
//  * 
//  */
// class flipped2 extends Component {
//   render() {
//     return (
//       <View>
//         <Text style={styles.welcome}>
//           自定义弹出Toast消息
//         </Text>
//         <CustomButton
//           text="点击弹出Toast消息"
//               onPress={()=>NativeModules.ToastCustomAndroid.startActivityFromJS("com.flipped.IntentActivity","我是从JS传过来的参数信息.456")}
//               // onPress={()=>NativeModules.ToastCustomAndroid.measureLayout((msg) => {console.log(msg)},(a,b,c,d) =>{console.log(a,b,c,d);alert(a)})}
//         />
//         <CustomButton
//           text="点击跳转到Activity界面,并且等待数据返回..."
//           onPress={()=>NativeModules.ToastCustomAndroid.startActivityFromJSGetResult("com.flipped.IntentActivity",200,(msg) => {
//                     ToastAndroid.show('JS界面:从Activity中传输过来的数据为:'+msg,ToastAndroid.SHORT);
//                   },
//                    (result) => {
//                     ToastAndroid.show('JS界面:错误信息为:'+result,ToastAndroid.SHORT);
//                   })}         
//           />
//       </View>
//     );
//   }
// }
// const styles = StyleSheet.create({
//   welcome: {
//     fontSize: 20,
//     textAlign: 'center',
//     margin: 10,
//   },
//   button: {
//     margin: 5,
//     backgroundColor: 'white',
//     padding: 15,
//     borderBottomWidth: StyleSheet.hairlineWidth,
//     borderBottomColor: '#cdcdcd',
//   },
// });

// AppRegistry.registerComponent('flipped', () => flipped2);

/**
 * 按功能分文件夹实现
 */
// import React, {
//   AppRegistry,
// } from 'react-native';
// import fdxApp from './source';

// AppRegistry.registerComponent('flipped', () => fdxApp);


/**
 * 30 Days of React Native
 * Icons made by <a href="http://www.flaticon.com/authors/vectors-market" title="Vectors Market">Vectors Market</a> from <a href="http://www.flaticon.com" title="Flaticon">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank">CC 3.0 BY</a>
 */
'use strict';

import React,{ Component } from 'react';
import  {
  AppRegistry,
  DeviceEventEmitter,
  Image,
  Navigator,
  ScrollView,
  StyleSheet,
  Text,
  TouchableHighlight,
  View
} from 'react-native';
import Util from './source/utils';
import Icon from 'react-native-vector-icons/Ionicons';
import IconFA from 'react-native-vector-icons/FontAwesome';

import Day1 from './source/day1';
// import Day2 from './view/day2';
// import Day3 from './view/day3';
// import Day4 from './view/day4';
// import Day5 from './view/day5';
// import Day6 from './view/day6';
// import Day7 from './view/day7';
// import Day8 from './view/day8';
// import Day9 from './view/day9';
// import Day10 from './view/day10';
// import Day11 from './view/day11';
// import Day12 from './view/day12';
// import Day13 from './view/day13';
// import Day14 from './view/day14';
// import Day15 from './view/day15';
// import Day16 from './view/day16';
// import Day17 from './view/day17';
// import Day18 from './view/day18';
// import Day19 from './view/day19';
// import Day20 from './view/day20';
// import Day21 from './view/day21';
// import Day22 from './view/day22';
// import Day23 from './view/day23';
// import Day24 from './view/day24';
// import Day25 from './view/day25';
// import Day26 from './view/day26';
// import Day27 from './view/day27';
// import Day28 from './view/day28';
// import Day29 from './view/day29';
// import Day30 from './view/day30';

class MainView extends Component {
  constructor() {
    super();
    this.state = {
      days: [{
        key: 0,
        title: '出库',
        // component: Day1,
        isFA: false,
        icon: "ios-stopwatch",
        size: 48,
        color: "#ff856c",
        hideNav: false,
        showValue: '出库',
      }, {
        key: 1,
        title: "入库",
        // component: Day2,
        isFA: false,
        icon: "ios-partlysunny",
        size: 60,
        color: "#90bdc1",
        hideNav: true,
        showValue: '入库',        
      }, {
        key: 2,
        title: "出库记录",
        // component: Day3,
        isFA: false,
        icon: "social-twitter",
        size: 50,
        color: "#2aa2ef",
        hideNav: true,
        showValue: '出库记录',        
      }, {
        key: 3,
        title: "入库记录",
        // component: Day4,
        isFA: true,
        icon: "contao",
        size: 50,
        color: "#FF9A05",
        hideNav: false,
        showValue: '入库记录',
      }]
    }
  }

  componentWillMount() {
    DeviceEventEmitter.addListener(
      'quickActionShortcut', (data) => {
        switch (data.title) {
          case "Day5":
            this._jumpToDay(4);
            break;
          case "Day22":
            this._jumpToDay(21);
            break;
          case "Day26":
            this._jumpToDay(25);
            break;
          case "Day28":
            this._jumpToDay(27);
            break;
        }
      });
  }

  _jumpToDay(index) {
  	// alert(index);
    this.props.navigator.push({
      title: this.state.days[index].title,
      component: this.state.days[index].component,
      navigationBarHidden: this.state.days[index].hideNav,
    })
  }

  render() {
    var onThis = this;
    var boxs = this.state.days.map(function(elem, index) {
      return (
        <TouchableHighlight key={elem.key} style={[styles.touchBox,styles.touchBox1]} underlayColor="#eee" onPress={()=> onThis._jumpToDay(index)}>
          <View style={styles.boxContainer}>
            <Text style={styles.boxText}>{ elem.title }</Text>
            {elem.isFA? <IconFA size={elem.size} name={elem.icon} style={[styles.boxIcon,{color:elem.color}]}></IconFA>:
              <Icon size={elem.size} name={elem.icon} style={[styles.boxIcon,{color:elem.color}]}></Icon>}
          </View>
        </TouchableHighlight>
      );
    })
    return (
      <ScrollView>
        <View style={styles.touchBoxContainer}>
          {boxs}
        </View>
      </ScrollView>
    );
  }
}

class forAndroid extends Component {
  componentDidMount() {
    // StatusBarIOS.setStyle(0);
  }

  render() {
    return ( 
      <Navigator initialRoute = {
        {
          name: 'My First Scene',
          index: 0
        }
      }
      renderScene = {
        (route, navigator) =>
        <MainView/>
      }
      />
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
  itemWrapper: {
    backgroundColor: '#f3f3f3'
  },
  touchBox: {
    width: Util.size.width / 3 - 0.34,
    height: Util.size.width / 3,
    backgroundColor: "#fff",
  },
  touchBoxContainer: {
    flexDirection: "row",
    flexWrap: "wrap",
    width: Util.size.width,
    borderTopWidth: Util.pixel,
    borderTopColor: "#ccc",
    borderLeftWidth: Util.pixel,
    borderLeftColor: "#ccc",
    borderRightWidth: Util.pixel,
    borderRightColor: "#ccc",
  },
  touchBox1: {
    borderBottomWidth: Util.pixel,
    borderBottomColor: "#ccc",
    borderRightWidth: Util.pixel,
    borderRightColor: "#ccc",
  },
  touchBox2: {
    borderBottomWidth: Util.pixel,
    borderBottomColor: "#ccc",
  },
  boxContainer: {
    alignItems: "center",
    justifyContent: "center",
    width: Util.size.width / 3,
    height: Util.size.width / 3,
  },
  boxIcon: {
    position: "relative",
    top: -10
  },
  boxText: {
    position: "absolute",
    bottom: 15,
    width: Util.size.width / 3,
    textAlign: "center",
    left: 0,
    backgroundColor: "transparent"
  },
  slide: {
    flex: 1,
    height: 150,
    justifyContent: 'center',
    alignItems: 'center',
  },
  slideText: {
    position: "absolute",
    bottom: 0,
    paddingTop: 5,
    paddingBottom: 5,
    backgroundColor: "rgba(255,255,255,0.5)",
    width: Util.size.width,
    textAlign: "center",
    fontSize: 12
  },
  image: {
    width: Util.size.width,
    flex: 1,
    alignSelf: 'stretch',
  }
});

AppRegistry.registerComponent('flipped', () => forAndroid);